import httpclient from '@ohos/httpclient';
export default {
    data: {
        ctx:null,
        isShow: false,
        finishWidth:0,
        img:null,
        httpClientImpl:null,
        runflag:false,
        intervalID:null,
        request:null
    },
    props: ['httpsrc'],
    onInit() {
        this.$watch('httpsrc', 'onPropertyChange');
        this.httpClientImpl = new httpclient.HttpClient.Builder().setConnectTimeout(15, httpclient.TimeUnit.SECONDS).setReadTimeout(15, httpclient.TimeUnit.SECONDS).build();
        this.request=new httpclient.Request.Builder()
            .url(this.httpsrc)
            .method('GET')
            .addHeader("Content-Type", "application/json")
            .params("token", "yukoyu")
            .build();
    },
    onPropertyChange(newW,oldW){
        this.request=new httpclient.Request.Builder()
            .url(newW)
            .method('GET')
            .addHeader("Content-Type", "application/json")
            .params("token", "yukoyu")
            .build();
    },
    videorun(){
        this.runflag=!this.runflag;
        if(this.runflag)
        {
            this.intervalID = setTimeout(this.onLiveVideo , 100);
        }else{
            clearTimeout(this.intervalID);

        }

    },
    onLiveVideo(){
        this.httpClientImpl.newCall(this.request).enqueue((result) => {
            //console.log("success: " + JSON.stringify(result))
            this.img.src = (JSON.parse(result.data)).data;
            var pat = this.ctx.createPattern(this.img, 'no-repeat');
            this.ctx.fillStyle = pat;
            this.ctx.fillRect(0, 0, 720, 420);
            if(this.runflag)
            {
                clearTimeout(this.intervalID);
                this.intervalID = setTimeout(this.onLiveVideo , 100);
            }else{
                this.img.src = '/common/images/live.png';
                var pat = this.ctx.createPattern(this.img, 'no-repeat');
                this.ctx.fillStyle = pat;
                this.ctx.fillRect(0, 0, 720, 420);
            }
        }, (error) => {
            console.log("error: " + JSON.stringify(error))
        })
    },
    onLayoutReady(){
        var el = this.$refs.canvasss;
        this.ctx = el.getContext('2d');

        this.img = new Image();
        this.img.src = '/common/images/live.png';
        var pat = this.ctx.createPattern(this.img, 'no-repeat');
        this.ctx.fillStyle = pat;
        this.ctx.fillRect(0, 0, 720, 420);
    }
}
